/*
 * @Author: wuqiang
 * @Date: 2023-07-13 21:36:57
 * @LastEditors: wuqiang
 * @LastEditTime: 2023-07-13 22:35:55
 */
import React, { forwardRef, memo, useImperativeHandle, useState } from 'react'
import usePortal from 'react-useportal'
import './index.scss'

const InsureModal = forwardRef((props, ref) => {
  const [visible, setVisible] = useState(false)
  const { Portal } = usePortal()
  useImperativeHandle(ref, () => ({
    toggle: v => setVisible(v)
  }))

  if (!visible) return null

  return (
    <Portal>
      <div className="comp-insure-modal" onClick={() => setVisible(false)}>
        <div className="insure_modal" onClick={(e) => {
          e.stopPropagation();
        }}>
          <div className='body'>
            <p>
            职工关爱公益项目着眼减轻基层一线职工日常就医用药负担，通过整合保险保障、医药服务等资源，构建全新医药关爱公益帮扶模式，该公益项目由中国职工发展基金会发起，在中华全国总工会权益保障部支持下，面向职工家庭发放专属“补充医药报销惠工卡”。该公益项目由中国职工发展基金会发起。
            </p>
            <p>
            我已阅读并同意<span>《服务协议》</span><span>《隐私政策》</span><span>《水滴客户告知书》</span><span>《责任免除》</span><span>《健康告知》</span><span>《特别约定》</span><span>《职业分类表》</span><span>《投保须知》</span>
            </p>
          </div>
          <div className="btn" onClick={() => setVisible(false)}>我已阅读并同意</div>
          <div className='footer'>
          本保障由中国人寿财产保险股份有限公司承保并授权天彩保险经纪提供申办服务。请阅读保险条款、投保须知、客户告知书等内容。为保障您的权益会安全记录您的操作
          </div>
        </div>
      </div>
    </Portal>
  )
})

export default memo(InsureModal)
